<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'play.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->

  <script type="text/javascript" src="js/jquery-1.8.3.js"></script>
  <script type="text/javascript">
	$(function(){
		$("#s1 li").hover(function(){
			var s=$(this).index();
			$("#pf").html(s+1);
			for(var i=0;i<=s;i++){
				$("#s1 li:eq("+i+") img").attr("src","img/1.png");
				}
			
		},function(){
			var s=$(this).index();
			for(var i=s;i>=0;i--){
				$("#s1 li:eq("+i+")  img").attr("src","img/2.png");
				}
			
		});
		$("#s1").toggle(function(){
			$("#s1 li").unbind("hover");
			
			var score=$("#pf").html();
                	
                		$.post(
                			"comm.do?action=subScore&score="+score,
                			function(data){
                			
                				data=data.replace(/^\s*/,"").replace(/\s*$/,"");
                				if(data=="true"){
                					$("#sco").html("谢谢参与评分！");
                				}else{
                					$("#sco").html("对不起，评分失败！");
                				}
                			},
                			"text"
                		);
			
		},function(){
			$("#s1 li").hover(function(){
			var s=$(this).index();
			$("#pf").html(s+1);
			for(var i=0;i<=s;i++){
				$("#s1 li:eq("+i+") img").attr("src","img/1.png");
				}
			
		},function(){
			var s=$(this).index();
			for(var i=s;i>=0;i--){
				$("#s1 li:eq("+i+")  img").attr("src","img/2.png");
				}
			
		});
		});
		
		//判断用户是否登陆
		$("#textarea").focus(function(){
			var sta=$("#youke").html();
			if("游客"==sta){
				alert("请返回首页登录！");
			}
		});
		
		//分页单击事件
		function clikGo(){
			var pageNo=document.getElementById("pageNo").value;
			location.href="movie.do?action=play&pageNo="+pageNo;
			
		}
		var totalPage;
		//异步刷新显示评论
		$("#but2").click(function(){
			var tr1="";
			var tr2="";
			var text=$("#textarea").val();
			//alert(text);
			text=encodeURI(encodeURI(text));
			//alert(text);
			var youke=$("#youke").html();
			youke=encodeURI(encodeURI(youke));
			var score=$("#pf").html();
			//alert($("#movie_id").html());
			var m_id=$("#movie_id").html();
		
			$.post(
				
				"comm.do?action=submitComm&movie_id="+$("#movie_id").html()+"&text="+text+"&youke="+youke+"&score="+score,
				function(data){
					//data=data.replace(/^\s*/, "").replace(/\s*$/, "");
					totalPage=data.totalPage;
					var s=data.list;
					alert(s);
					for(var i=0;i<s.length;i++){
						
						var s1=s[i];
						tr1+="<tr>"+
						"<td style='color:#00ff00;line-height: 30px;'>"+s1.m_comment+"</td>"+
						"</tr>";
					
					}
					
					$("#resu1").html(tr1);
					
					
					
				},
				"json"
			);
		
		});
		/*$("#but2").click(function(){
			$("#tr2").hide();
			
		
		});*/
		var pageNo=0;
		$("#shouYe").click(function(){
			alert("123");
			var tr1="";
			var tr2="";
			var text=$("#textarea").val();
			//alert(text);
			text=encodeURI(encodeURI(text));
			//alert(text);
			var youke=$("#youke").html();
			youke=encodeURI(encodeURI(youke));
			var score=$("#pf").html();
			//alert($("#movie_id").html());
			var m_id=$("#movie_id").html();
			$.post(
				"comm.do?action=submitComm&movie_id="+$("#movie_id").html()+"&text="+text+"&youke="+youke+"&score="+score+"&pageNo="+4,
				function(data){
					var s=data.list;
					alert(s);
					for(var i=0;i<s.length;i++){
						alert(totalPage);
						var s1=s[i];
						alert(s1.m_comment);
						tr1+="<tr>"+
						"<td style='color:#00ff00;line-height: 30px;'>"+s1.m_comment+"</td>"+
						"</tr>";
					
					}
					
					$("#resu1").html(tr1);
					
				},
				"json"
			);
		
		});
	});
</script>
<style type="text/css">
	*{margin:0;padding:0;}
	li{ list-style-type:none;}
	a:link{color:#5fb701;}
	a:visited{color:#5fb701;}
	a:hover{color:white;}
	a:active{color:black; }
	#body{background-color:#3f444e;}
	#all{width:1010px;margin:0 auto;}
	#all #score{overflow:hidden;margin-top:20px;}
	#all #score #img{float:left;}
	#all #score #star{float:left;margin-left:20px;}
	#all #score #star #liebiao #daoYan li{margin-top: 10px;}
	#all #play{background-color:#000;}
	#all #score #star{}
	#all #score #star li{width:24px;height:24px;float:left;}
	#all #score #star li.pf{background-image:none;color:#00FF00}
	#all #score #star .s1{float:left;}
	.addImg{background-image:url(img/1.png)}
	#sub{background-color: green;color: white;position: relative;left: 315px;}
		
		#footer{width: 847px;margin:0 auto;overflow:hidden;}
		#b1{width:400px;margin:0 auto;height:24px;line-height:24px;text-align:center;margin-top:30px;}
		#b1 ul{overflow:hidden;}
		#b1 li{float:left;}
		#b2{width:530px;margin:0 auto;font-size:12px;margin-top:15px;}
		#b3{width:210px;overflow:hidden;margin:0 auto;padding-top:15px;margin-bottom:30px; }
		#b3 img{float:left;padding-right:10px;}
		#footer span{ border-right:#898989 solid 1px;display:block;float:right;height:14px;margin-top:5px;
		margin-right:10px;margin-left:10px;}
</style>
  </head>
  
  <body id="body">
	<div id="all">
    	<div id="score">
        	<div id="img" style="width:121px;height:161px;">
            	<img src="${movie.imgurl}"/>
            </div>
            <div id="star">
            	<ul class="s1" id="s1">
                	<li id="LL1"><img src="img/2.png"/></li>
                    <li id="LL2"><img src="img/2.png"/></li>
                    <li id="LL3"><img src="img/2.png"/></li>
                    <li id="LL4"><img src="img/2.png"/></li>
                    <li id="LL5"><img src="img/2.png"/></li>
                    <li id="LL6"><img src="img/2.png"/></li>
                    <li id="LL7"><img src="img/2.png"/></li>
                    <li id="LL8"><img src="img/2.png"/></li>
                    <li id="LL1"><img src="img/2.png"/></li>
                    <li id="LL1"><img src="img/2.png"/></li>
                </ul>
                <script type="text/javascript">
                	
                </script>
                <ul class="s1" id="s2">
                	<li class="pf" id="pf"></li>
                    <li class="pf">分</li>
                    <li id="sco" style="color: red; width: 200px;"></li>
                </ul>
                <div id="liebiao" style="clear:both; float:left;">
	            	<ul style="color:#FFFFFF;" id="daoYan">
	            		<li id="movie_id" style="display: none;">${movie.id}</li>
	                	<li style="float:none;width:200px;">导演：<span>${movie.dictor}</span></li>
	                    <li style="float:none;width:200px;">主演：<span>${movie.actor}</span></li>
	                    <li style="float:none;width:200px;">时长：<span>${movie.time}</span></li>
	                    <li style="float:none;width:200px;">评分：<span>${movie.score}</span></li>
	                </ul>
            </div>
            </div>
            
        </div>
        
        <div id="play">
        	<div style="padding-top:40px; margin-left:25px;">
                <video   controls="true" width="960px" height="400px" preload="none">
                <source src="${movie.playurl}" type="video/mp4">
                您的浏览器不支持音频与视频
                </video><br/>
             </div>  
             <div style="position:relative;left:710px;">
              <a href="comm.do?action=down&movie_id=${movie.id}">点击下载</a>
              &nbsp;&nbsp;&nbsp;<a href="javaScript:history.back()">返回首页</a>
             </div>
        </div>
        <div id="title">
            	<h1 style="color:#00b7ee; margin-top:10px;margin-bottom:10px;margin-left:10px;">评论专区</h1>
            </div>
        <div id="comm">
        
        	   <div style="float: left;">
            	<form method="post" action="comm.do?action=submitComm&movie_id=${movie.id}" name="commFrom">
                	<table>
                    	<tr>
                        	<td style="color:#FFFFFF">用户名：<span id="youke"><c:out value="${userInfo.m_username}" default="游客"/></span></td>
                            <td></td>
                        </tr>
                        <tr>
                        	<td><textarea rows="8" cols="40" id="textarea" name="textarea"></textarea><span style="color: red;">${errorComm}</span></td>
                        </tr>
                        <tr>
                        	<td><input type="button" name="but2" id="but2" value="提交"/></td>
                        </tr>
                        
                        <tr>
                        	<td></td>
                        </tr>
                    </table>
                </form>
            </div>
        
        	<div style="float: left; padding-top: 20px;margin-left: 100px;">
            	<table id="resu1">
	            	<c:forEach items="${page.list}" var="i" varStatus="v">
	                	<tr>
	                		
	                    	<td style="color:#00ff00;line-height: 30px;">&nbsp;&nbsp;&nbsp;&nbsp;${i.m_comment}</td>
	                    </tr>
	                </c:forEach> 
                </table>
                <table id="resu2">
                <tr id="tr2">
                	<td >
                		<span style="color:#00ff00">共${page.totalCount }个评论&nbsp;&nbsp;&nbsp;&nbsp;
	当前第${page.pageNo }
	页/共${page.totalPage }页</span>
	<input type="button" name="shouYe" id="shouYe" value="首页"/>
	<a href="movie.do?pageNo=${page.pageNo-1 }&action=play&id=${movie.id}">上一页</a>
	<a href="movie.do?pageNo=${page.pageNo+1 }&action=play&id=${movie.id}">下一页</a>
	<a href="movie.do?pageNo=${page.totalPage }&action=play&id=${movie.id}">末页</a>
	<input type="text" size="5" id="pageNo" name="pageNo" />
	<script>
		function clikGo(){
			var pageNo=document.getElementById("pageNo").value;
			location.href="movie.do?action=play&pageNo="+pageNo;
		}
	</script>
	<input type="button" value="Go" onclick="clikGo()" />
                	</td>
                </tr>
                </table>
            </div>
            
         
        </div>
    </div>
    <div id="footer" style="color: white;">
		<div id="b1">
            	<ul>
                <li><a href="movie.do">首页</a><span></span></li>
                <li><a href="#">客户服务</a><span></span></li>
                <li><a href="#">品牌合作</a><span></span></li>
                <li><a href="#">网站联盟</a><span></span></li>
                <li><a href="#">投诉与建议</a></li>
                </ul>
            </div>
		<div id="b2">
            	<p>copyright&copy;2011 vijia.com All Rights Reserved京ICP备08800757号 京公网安备110105005426</p>
            </div>
            <div id="b3">
            	<ul>
                    <li><img src="img/imgs/btm_logo_1.gif" /></li>
                    <li><img src="img/imgs/btm_logo_2.gif" /></li>
            	</ul>
            </div>
	</div>
</body>
</html>
